<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp" %>
<html>
<head>
    <title>区域管理</title>
    <meta name="decorator" content="nblank"/>
    <%@include file="/WEB-INF/views/include/treetable.jsp" %>
</head>
<body>
<div class="content container">
    <h2 class="page-title">区域管理<small> 区域列表</small></h2>
    <section class="widget widget-tabs widget-table-overflow" style="padding: 0;">
        <header>
            <ul class="nav nav-tabs">
                <li class="active"><a href="javascript:;">区域列表</a></li>
                <shiro:hasPermission name="sys:area:edit">
                    <li><a href="${ctx}/sys/area/form">区域添加</a></li>
                </shiro:hasPermission>
            </ul>
        </header>
        <%--<sys:message content="${message}"/>--%>
        <div class="body tab-content">
            <form id="listForm" method="post">
                <table id="treeTable" class="table table-striped table-lg mb-0 tree_table">
                    <thead>
                    <tr>
                        <th>区域名称</th>
                        <th>区域编码</th>
                        <th>区域类型</th>
                        <th>备注</th>
                        <shiro:hasPermission name="sys:area:edit">
                            <th>操作</th>
                        </shiro:hasPermission></tr>
                    </thead>
                    <tbody id="treeTableList"></tbody>
                </table>
            </form>
        </div>
    </section>
</div>
<script type="text/template" id="areaList_treeTableTpl">
    <tr id="{{row.id}}" pId="{{pid}}">
        <td><a href="${ctx}/sys/area/form?id={{row.id}}">{{row.name}}</a></td>
        <td>{{row.code}}</td>
        <td>{{dict.type}}</td>
        <td>{{row.remarks}}</td>
        <shiro:hasPermission name="sys:area:edit">
            <td>
                <a href="${ctx}/sys/area/form?id={{row.id}}">修改</a>
                <a href="${ctx}/sys/area/delete?id={{row.id}}" class="no-pjax"
                   onclick="confirmx('要删除该区域及所有子区域项吗？', this.href);return false;">删除</a>
                <a href="${ctx}/sys/area/form?parent.id={{row.id}}">添加下级区域</a>
            </td>
        </shiro:hasPermission>
    </tr>
</script>
<script type="text/javascript">
    $(document).ready(function () {
        var tpl = $("#areaList_treeTableTpl").html().replace(/(\/\/\<!\-\-)|(\/\/\-\->)/g, "");
        var data = ${fns:toJson(list)}, rootId = "0";
        addRow("#treeTableList", tpl, data, rootId, true);
        $("#treeTable").treeTable({expandLevel: 5});
    });
    function addRow(list, tpl, data, pid, root) {
        for (var i = 0; i < data.length; i++) {
            var row = data[i];
            if ((${fns:jsGetVal('row.parentId')}) == pid) {
                $(list).append(Mustache.render(tpl, {
                    dict: {
                        type: getDictLabel(${fns:toJson(fns:getDictList('sys_area_type'))}, row.type)
                    }, pid: (root ? 0 : pid), row: row
                }));
                addRow(list, tpl, data, row.id);
            }
        }
    }
</script>
</body>
</html>

